﻿<UserControl x:Class="XAMLMagicks.UserControls.CustomExpanderTemplateControl"
             xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
             xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
             xmlns:mc="http://schemas.openxmlformats.org/markup-compatibility/2006" 
             xmlns:d="http://schemas.microsoft.com/expression/blend/2008" 
             mc:Ignorable="d" 
             d:DesignHeight="300" d:DesignWidth="300">
    <UserControl.Resources>
        <Style x:Key="CustomExpanderStyle" TargetType="{x:Type Expander}">
            <Setter Property="Foreground" Value="{DynamicResource {x:Static SystemColors.ControlTextBrushKey}}" />
            <Setter Property="HorizontalContentAlignment" Value="Stretch" />
            <Setter Property="VerticalContentAlignment" Value="Stretch" />
            <Setter Property="BorderBrush" Value="Black" />
            <Setter Property="BorderThickness" Value="1pt" />
            <Setter Property="Template">
                <Setter.Value>
                    <ControlTemplate TargetType="{x:Type Expander}">
                        <Border BorderThickness="{TemplateBinding Border.BorderThickness}" 
                                    CornerRadius="0" 
                                    BorderBrush="{TemplateBinding Border.BorderBrush}" 
                                    Background="{TemplateBinding Panel.Background}" 
                                    SnapsToDevicePixels="True"
                                    >
                            <DockPanel>
                                <ToggleButton IsChecked="{Binding Path=IsExpanded, Mode=TwoWay, RelativeSource={RelativeSource TemplatedParent}}" 
                                                  Content="{TemplateBinding HeaderedContentControl.Header}" 
                                                  ContentTemplate="{TemplateBinding HeaderedContentControl.HeaderTemplate}" 
                                                  Foreground="{TemplateBinding TextElement.Foreground}" 
                                                  FontFamily="{TemplateBinding TextElement.FontFamily}" 
                                                  FontSize="{TemplateBinding TextElement.FontSize}" 
                                                  FontStretch="{TemplateBinding TextElement.FontStretch}" 
                                                  FontStyle="{TemplateBinding TextElement.FontStyle}" 
                                                  FontWeight="{TemplateBinding TextElement.FontWeight}" 
                                                  HorizontalContentAlignment="{TemplateBinding Control.HorizontalContentAlignment}" 
                                                  VerticalContentAlignment="{TemplateBinding Control.VerticalContentAlignment}"
                                                  Padding="{TemplateBinding Control.Padding}" 
                                                  Name="HeaderSite"
                                                  MinWidth="0" MinHeight="0"
                                                  Margin="0pt" DockPanel.Dock="Top"
                                                  >
                                    <ToggleButton.Style>
                                        <Style TargetType="{x:Type ToggleButton}">
                                            <Setter Property="Background" Value="{x:Null}" />
                                            <Setter Property="Template">
                                                <Setter.Value>
                                                    <ControlTemplate TargetType="{x:Type ToggleButton}">
                                                        <Border Padding="0,2pt,0,2pt"
                                                                    Background="Gray"
                                                                    BorderBrush="Black"
                                                                    BorderThickness="1pt"
                                                                    >
                                                            <Grid>
                                                                <Grid.ColumnDefinitions>
                                                                    <ColumnDefinition Width="16" />
                                                                    <ColumnDefinition />
                                                                </Grid.ColumnDefinitions>
                                                                <Ellipse Width="16" Height="16"
                                                                         HorizontalAlignment="Center" VerticalAlignment="Center"
                                                                         Stroke="Red" StrokeThickness="1pt"
                                                                         />
                                                                <Path x:Name="Indicator"
                                                                          Stroke="Purple" StrokeThickness="1pt"
                                                                          HorizontalAlignment="Center"
                                                                          VerticalAlignment="Center"
                                                                          Data="M1,1.5L4.5,5 8,1.5"
                                                                          />
                                                                <ContentPresenter Grid.Column="1" Margin="2pt,0,0,0"
                                                                                      RecognizesAccessKey="True" 
                                                                                      Content="{TemplateBinding ContentControl.Content}" 
                                                                                      ContentTemplate="{TemplateBinding ContentControl.ContentTemplate}" 
                                                                                      ContentStringFormat="{TemplateBinding ContentControl.ContentStringFormat}"                                                                                       
                                                                                      HorizontalAlignment="Stretch" 
                                                                                      VerticalAlignment="Center" 
                                                                                      SnapsToDevicePixels="True" 
                                                                                      />
                                                            </Grid>
                                                        </Border>
                                                        <ControlTemplate.Triggers>
                                                            <Trigger Property="IsChecked" Value="True">
                                                                <Setter TargetName="Indicator" Property="Data" Value="M1,4.5L4.5,1 8,4.5" />
                                                            </Trigger>
                                                        </ControlTemplate.Triggers>
                                                    </ControlTemplate>
                                                </Setter.Value>
                                            </Setter>
                                        </Style>
                                    </ToggleButton.Style>
                                    <ToggleButton.FocusVisualStyle>
                                        <Style>
                                            <Setter Property="Control.Template">
                                                <Setter.Value>
                                                    <ControlTemplate>
                                                        <Border>
                                                            <Rectangle Stroke="White" StrokeThickness="1" StrokeDashArray="1 2" Margin="0,0,0,0" SnapsToDevicePixels="True" />
                                                        </Border>
                                                    </ControlTemplate>
                                                </Setter.Value>
                                            </Setter>
                                        </Style>
                                    </ToggleButton.FocusVisualStyle>
                                </ToggleButton>
                                <ContentPresenter Content="{TemplateBinding ContentControl.Content}" 
                                                      ContentTemplate="{TemplateBinding ContentControl.ContentTemplate}" 
                                                      ContentStringFormat="{TemplateBinding ContentControl.ContentStringFormat}" 
                                                      Name="ExpandSite" 
                                                      Margin="{TemplateBinding Control.Padding}" 
                                                      HorizontalAlignment="{TemplateBinding Control.HorizontalContentAlignment}" 
                                                      VerticalAlignment="{TemplateBinding Control.VerticalContentAlignment}" 
                                                      Focusable="False" DockPanel.Dock="Bottom" 
                                                      >
                                    <ContentPresenter.Style>
                                        <Style TargetType="{x:Type ContentPresenter}">
                                            <Setter Property="Visibility" Value="Collapsed" />
                                        </Style>
                                    </ContentPresenter.Style>
                                </ContentPresenter>
                            </DockPanel>
                        </Border>
                        <ControlTemplate.Triggers>
                            <Trigger Property="IsExpanded" Value="True">
                                <Setter Property="Visibility" Value="Visible" TargetName="ExpandSite" />
                            </Trigger>
                            <Trigger Property="IsEnabled" Value="False">
                                <Setter Property="Foreground" Value="{DynamicResource {x:Static SystemColors.GrayTextBrushKey}}" />
                            </Trigger>
                        </ControlTemplate.Triggers>
                    </ControlTemplate>
                </Setter.Value>
            </Setter>
        </Style>
    </UserControl.Resources>
    <Grid>
        <Expander Header="Custom Expander"
                  Style="{StaticResource CustomExpanderStyle}"
                  IsExpanded="False"
                  >
            <Image Source="/XAMLMagicks;component/Resources/CatCouch.jpg"
                   HorizontalAlignment="Stretch"
                   VerticalAlignment="Stretch"
                   Stretch="Fill"
                   />
        </Expander>
    </Grid>
</UserControl>
